import 'package:fate_blind_box/theme/theme_color.dart';
import 'package:fate_blind_box/utils/provider.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:roundcheckbox/roundcheckbox.dart';

import '../../../network/Api.dart';
import '../../../network/http_config.dart';
import '../../../utils/loading.dart';
import '../../../utils/snack_bar.dart';
import '../../login/WebView.dart';
import '../matchMaker/matchMaker.dart';

//选择红娘类型chooseMat
class typeMakerUI extends StatefulWidget {
  typeMakerUI({Key? key}) : super(key: key);

  @override
  State<typeMakerUI> createState() => _typeMakerState();
}

class _typeMakerState extends State<typeMakerUI> {
  final TextEditingController _nameController = TextEditingController();
  bool check = false;
  getCheckBoxBorderColor() {
    if (check) {
      return const Color(0xFF7F69D9);
    } else {
      return const Color(0xFFD1D1D1);
    }
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
  }

  // 修改个人简介
  _getUserinfo() async {
    final res = await Api.getInstance()
        .ModifyMeIntroduce(Provider.memberId, _nameController.text);
    final data = res['msg'];
    ThemeSnackBar.show(context, data);
    Navigator.of(context).pop();
  }

  @override
  Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;
    return Scaffold(
      appBar: AppBar(
        // iconTheme: const IconThemeData(
        //   color: Colors.white,
        // ),
        title: const Text(
          '选择红娘类型',
          style: TextStyle(color: Colors.black, fontSize: 16),
        ),
        elevation: 0,
        backgroundColor: Colors.white,
      ),
      backgroundColor: Colors.white,
      body: Align(
        alignment: Alignment.topCenter,
        child: Container(
            // margin: EdgeInsets.only(top: 20),
            width: size.width,
            height: 483,
            color: Colors.white,
            child: Stack(
              children: [
                Image.asset(
                  "images/chooseMat.png",
                  width: size.width,
                  height: 460,
                  fit: BoxFit.cover,
                ),
                Container(
                  alignment: Alignment.topCenter,
                  margin: const EdgeInsets.only(top: 160),
                  child: const Text(
                    '红娘类型',
                    style: TextStyle(color: Color(0xFFD65E64), fontSize: 16),
                  ),
                ),
                Column(
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Column(
                          children: [
                            GestureDetector(
                              onTap: () {
                                _chooseType(context, '确认选择个人红娘', check);
                              },
                              child: Container(
                                margin: const EdgeInsets.only(
                                  top: 190,
                                ),
                                child: Image.asset(
                                  "images/personMarket.png",
                                  width: 56,
                                  height: 56,
                                  fit: BoxFit.cover,
                                ),
                              ),
                            ),
                            const SizedBox(
                              height: 3,
                            ),
                            const Text(
                              "个人",
                              style: TextStyle(
                                  color: Color(0xFFFD6381), fontSize: 14),
                            ),
                          ],
                        ),
                        const SizedBox(
                          width: 50,
                        ),
                        Column(
                          children: [
                            GestureDetector(
                              onTap: () {
                                _chooseType(context, '确认选择商家红娘', check);
                              },
                              child: Container(
                                margin: const EdgeInsets.only(
                                  top: 190,
                                ),
                                child: Image.asset(
                                  "images/instiMarket.png",
                                  width: 56,
                                  height: 56,
                                  fit: BoxFit.cover,
                                ),
                              ),
                            ),
                            const SizedBox(
                              height: 3,
                            ),
                            Text(
                              "商家",
                              style: TextStyle(
                                  color: ThemeColor.textColor, fontSize: 14),
                            ),
                          ],
                        )
                      ],
                    ),
                    Container(
                      alignment: Alignment.center,
                      margin: const EdgeInsets.only(top: 10),
                      child: Text(
                        "请慎重选择红娘类型",
                        style: TextStyle(
                            color: ThemeColor.textColor, fontSize: 12),
                      ),
                    ),
                    const SizedBox(
                      height: 5,
                    ),
                    Container(
                        // padding: EdgeInsets.only(top: 190),
                        child: Column(
                      children: [
                        Row(
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            RoundCheckBox(
                                size: 16, //checkBox大小
                                checkedWidget: const Icon(
                                  Icons.check,
                                  color: Colors.white,
                                  size: 8,
                                ),
                                checkedColor: const Color(0xFF7F69D9),
                                uncheckedColor: const Color(0xFFF6F8FA),
                                border: Border.all(
                                    color: getCheckBoxBorderColor(), width: 1),
                                isChecked: check,
                                onTap: (selected) {
                                  if (check) {
                                    check = false;
                                  } else {
                                    check = true;
                                  }
                                  setState(() {});
                                }),
                            const SizedBox(
                              width: 3,
                            ),
                            Container(
                              child: Center(
                                  child: Text.rich(TextSpan(children: [
                                TextSpan(
                                  text: "我已阅读并同意",
                                  style: const TextStyle(
                                      color: Color(0xFFCECECE), fontSize: 10),
                                  recognizer: TapGestureRecognizer()
                                    ..onTap = () {
                                      setState(() {
                                        if (check) {
                                          check = false;
                                        } else {
                                          check = true;
                                        }
                                      });
                                    },
                                ),
                              ]))),
                            ),
                          ],
                        ),
                        const SizedBox(
                          height: 5,
                        ),
                        Container(
                          child: Center(
                              child: Text.rich(TextSpan(children: [
                            TextSpan(
                              text: "《隐私协议》",
                              style: const TextStyle(
                                  color: Color(0xFF7F69D9), fontSize: 10),
                              recognizer: TapGestureRecognizer()
                                ..onTap = () {
                                  Navigator.push(context, MaterialPageRoute(
                                      builder: (BuildContext context) {
                                    return const Browser(
                                        '隐私协议', '${HttpConfig.baseUrl}priva');
                                  }));
                                },
                            ),
                            TextSpan(
                              text: "《服务协议》",
                              style: const TextStyle(
                                  color: Color(0xFF7F69D9), fontSize: 10),
                              recognizer: TapGestureRecognizer()
                                ..onTap = () {
                                  Navigator.push(context, MaterialPageRoute(
                                      builder: (BuildContext context) {
                                    return const Browser(
                                        '服务协议', '${HttpConfig.baseUrl}serv');
                                  }));
                                  // Navigator.of(context).push(MaterialPageRoute(builder: (ctx) => const Browser('隐私洗衣','https://www.baidu.com')));
                                  // Navigator.of(context).push(MaterialPageRoute(builder: (builder) =>   WebviewPageShow(
                                  //     )));
                                },
                            )
                          ]))),
                        ),
                      ],
                    )),
                  ],
                )
              ],
            )),
      ),
    );
  }
}

Future<void> _chooseType(context, String title, bool check) async {
  showCupertinoDialog(
      context: context,
      builder: (context) {
        return CupertinoAlertDialog(
          title: Text(title),
          actions: <Widget>[
            CupertinoDialogAction(
              onPressed: () {
                Navigator.pop(context);
              },
              child: const Text(
                '取消',
                style: TextStyle(fontSize: 16, color: Colors.black),
              ),
            ),
            CupertinoDialogAction(
              onPressed: () {
                Navigator.pop(context);
                String textStr;
                if (title == '确认选择个人红娘') {
                  textStr = '个人红娘';
                } else {
                  textStr = '商家红娘';
                }
                if (check == false) {
                  toast("请先同意协议");
                } else {
                  Navigator.of(context).push(MaterialPageRoute(
                      builder: (builder) => matchMakerUI(textStr)));
                }
              },
              child: Text(
                '确定',
                style: TextStyle(fontSize: 16, color: ThemeColor.appColor),
              ),
            ),
          ],
        );
      });
}
